<script>
  import List from '../components/list.svelte';
  import Btn from '../components/btn.svelte';
  import Paging from '../components/paging.svelte';
  import {onMount} from 'svelte';
  import {Post} from '../lib/net.js';
  import {WithdrawRefuse, WithdrawConfirm, WithdrawList, AgentList,SearchAgent} from '../api.js';
  import Query from '../model/query.js';
  import moment from 'moment';
  import QueryBar from '../components/queryBar.svelte';
  import {IsAdmin} from '../lib/token.js';
  import { MoneyType,WithdrawState,warning} from '../conf.js';

  let btnText = `<i>+</i>添加代理`
  let btnHref = "/agent/add"

  let data = {title: ["UID", "姓名", "手机号","邮箱", "代理人", "身份证","订单编号", "提币方式", "提币数量","是否>50usdt", "提币地址", "手续费", "申请时间", "状态"], data: []}

  let total = 0;

  var query = new Query();
  var wahaha = '';
  onMount(() => {
    getList();
  });

  async function getList(e) {
    console.log(e)
    if (e) {
      query.start = e.detail.start
      query.end = e.detail.end
      if (e.detail.types !== 1) {
                let ret = await Post(SearchAgent, {
                    type: e.detail.types,
                    condition: query.condition,
                });
                query.condition = "";
                query.admin = ret
                if(query.admin == -100) return
      } else {
        query.admin = null
      }
    }
    query.size = 7;
    let ret = await Post(WithdrawList, query)
    console.log(ret)
    query.total = ret.total;
    query.page = ret.page;
    query.size = ret.size;
	wahaha = ret.Extra.withdraw_total;
    let _data = [];
	
    if (query.state >= 1) {
      data.title = ["UID", "姓名", "手机号","邮箱", "代理人","身份证", "订单编号", "提币方式", "提币数量","是否>50usdt", "提币地址", "手续费", "申请时间", "状态"];
    }
    for (let item of ret.list) {
		// is-danger  warning
		//,item.calcdis>50?`<div class="backRed colorWhite">`+item.calcdis+`--请检查账户</div>`:item.calcdis
		/* var thisTr = $(".table tr:gt(0)");
		  thisTr.addClass("oddRow");
		 thisTr.bind("mouseover", function() {
			 $(this).addClass("activeRow");
		 });
		 thisTr.bind("mouseout", function() {
			 $(this).removeClass("activeRow");
		 }); */
		 var mytable = document.querySelector(".table");   
		 var row = mytable.insertRow();   
		 console.log(row)
		 // var mytd= row.insertCell();    
		 // mytd.className=”table01-td01”;  
      let arr = [
        item.uid, 
		item.name, 
		item.phone,
		item.email, 
		item.agent,
		item.card_id, 
		item.tid, 
		MoneyType[item.coin_type],
		item.amount,
		item.calcdis>50?`<div class="backRed colorWhite">`+item.calcdis+`--请检查账户</div>`:item.calcdis, 
		item.withdraw_addr, 
		item.fee, 
		item.show_operate_date
      ]
      if (!query.state && IsAdmin()) {
        arr.push(`<button class="button is-success is-small" data-id=${item.tid} type="access" on:click> 通过 </button>`)
        arr.push(`<button class="button is-danger is-small" data-id=${item.tid} type="failed" on:click>取消</button>`)
      }
      arr.id = item.tid;
      arr.handler = access;
      _data.push(arr);
    }
    data.data = _data;
  }

  async function access() {

    let btn = this.querySelector("button");

    let tid = btn.getAttribute("data-id");
    let btnType = btn.getAttribute("type");

    if (btnType == "access") {
      await Post(WithdrawConfirm, {tid});
    } else {
      await Post(WithdrawRefuse, {tid})
    }

    getList();
  }

  function setPage(page) {
    query.page = page;
    getList();
  }

  function prepareList() {
    query.state = 0;
    getList();
  }

  function accessList(e) {
    query.state = 1;
    getList();
  }

  function doneList(e) {
    query.state = 2;
    getList();
  }
</script>

<div class="view">
				<div class="borderRadius4 container" style="margin:0">
						<div class="columns rowReverse" style="padding: 20px;">
								<div class="column is-4">
										<div class="rowNumCenter">
												<span class="left1">用户数量：</span>
												<span class="mid1" style="color:forestgreen">{query.total}</span>
												<span class="left1">人</span>
										</div>
										<div class="rowNumCenter">
												<span class="left1">资金总计：</span>
												<span class="mid1" style="color:forestgreen">{wahaha}</span>
												<span class="left1">USDT</span>
										</div>
								</div>
						</div>
				</div>
		<div style="display: flex;flex-direction: row;align-items: center;width: 99%;margin: 5px;height: 60px;background-color: white;margin-top: 5px"
				 class="borderRadius4">
        <span style="color: #20222A;margin: 20px">
            充提币管理-待审核
        </span>
		</div>
		<div class="borderRadius4 container rowCenter " style="margin-top: 0px">
				<QueryBar query={query} on:message={getList}/>
		</div>
		<div class="container" style="margin-top: -10px">
				<List data={data}/>
		</div>
		<div class="container rowReverse">
			{#if query.total !== 0}
			<Paging page={query} handler={setPage}/>
			{/if}
		</div>
</div>

<style>
		
		.rowNumCenter{
			display: flex;
			flex-direction: row;
			align-items: center;
			justify-content: flex-end;
			font-size: 12px;
		}
		.containerHold {
			margin: 20px 1%;
			width: 50px;
			position: absolute;
			top: 20%;
		}
		
		.borderRadius4 {
				border-radius: 4px;
		}

		.container {
				margin: 20px 5px;
		}

		.info {
				background: #fff;
		}

		.btn {
				line-height: 5px;
				top: 50%;
				transform: translateY(10%);
		}

		.view {
				overflow-y: scroll;
		}
</style>
